<template>
  <div style="padding-bottom: 50px">
    <span>{{ total }}</span>
    <van-list
      v-model="loading"
      :finished="finished"
      finished-text="没有更多了"
      @load="onLoad"
      offset="80"
    >
      <ArticleItem
        :item="item"
        :key="item.id"
        v-for="item in list"
      ></ArticleItem>
      <van-cell v-for="item in list" :key="item.id" :title="item.stem" />
    </van-list>
  </div>
</template>
<script>
import { CollectlikeAPI } from '@/api/collect.js'
export default {
  name: 'collect',
  data () {
    return {
      obj: {
        optType: 2,
        pageSize: 7,
        page: 0,

      },
      list: [],
      loading: false,
      finished: false,
      total: 0

    }
  },
  created () {
  },
  computed: {
  },
  methods: {

    onLoad () {

      if (this.obj.page * this.obj.pageSize > this.total) {
        this.finished = true
        return
      }
      this.obj.page++
      // 异步更新数据
      this.getCollectlikeAPI()


    },


    //获取数据
    async getCollectlikeAPI () {
      const res = await CollectlikeAPI(this.obj)
      console.log(res, 8898989);
      this.total = res.data.total
      this.list = [...this.list, ...res.data.rows]
      this.loading = false

    }
  }
}
</script>
<style lang='less'  scoped>
</style>
